<template>
  <div class="nav_outer">
    <Header>邀请记录</Header>
    <div class="records">
        <div class="record flex_center"  v-for="item in records" v-bind:key="item.id">
            <div class="recordname">
                {{item.name}}
            </div>
            <div class="recorddate">
              <!-- <span>2018---</span> -->
                {{item.jobStatusName}}
            </div>
        </div>
    </div>
  </div>
</template>

<script>
import Header from '@/components/commonComponents/Header'
export default {
  data() {
    return {
      records: []
    }
  },
  created() {
    this.loadRecords();
  },
  methods: {
    loadRecords(){
      let uid = this.$store.state.user.id;
      this.Http.get(`/yzj/invitation/inviter/${uid}`, null).then(res => {
        this.records = res;
      });
    }
  },
  components: {
    Header
  }
}
</script>

<style lang='scss' scoped>
  @function px2em($px) {
    @if (unitless($px)) {
      @return px2em($px + 0px);
    } @else if (unit($px) == em) {
      @return $px;
    }
    @return ($px / 75px) * 1rem;
  }
  body{
    background: #F5F5F5!important;
  }
  .records{
    .record{
      justify-content: space-around;
      height: px2em(80);
      line-height: px2em(80);
      background: #fff;
      margin-top: 2px;
    }
  }
</style>